<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>提现列表</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/css.css" />
</head>

<body>
<style>

    .reconciliation_list_csl{
        height: 100%;
        display: flex;
        justify-content: space-around;
        align-items: flex-start;
        flex-direction: column;
    }
    .reconciliation_list_csr{
        height: 100%;
    }
    .money-status{
        height: 100%;
        display: flex;
        justify-content: space-around;
        align-items: flex-end;
        flex-direction: column;
    }
    [v-cloak] {
        display: none;
    }
</style>
<div v-cloak id="wrap" class="flex-wrap flex-vertical reconciliation">
    <header>
        <ul>
            <li class="active">
                <i onclick="back()" class="icon iconfont icon-back"></i>
                <span>提现列表</span>
            </li>
        </ul>
    </header>
    <div class="reconciliationlistbody fixed-header">
        <div>
            <div class="reconciliation_list_c">
                <div class="classno" v-if="list.length==0">
                    <i class="icon iconfont icon-wendang"></i>
                    <p>暂无内容</p>
                </div>
                <!--<div v-if="list.length!=0" v-for="(item,index) in list" :key="index" @click="goDetail(item.id)">-->
                <div v-if="list.length!=0" v-for="(item,index) in list" :key="index">
                    <div class="reconciliation_list_cs" v-if="item.ordertype==1">
                        <div class="reconciliation_list_csl">
                            <p>{{item.title}}</p>
                            <span>{{item.createtime}}</span>
                        </div>
                        <div class="reconciliation_list_csr">
                            <span>{{item.money}}</span><i class="icon iconfont icon-right"></i>
                        </div>
                    </div>
                    <div class="reconciliation_list_cs reconciliation_list_cs2" v-else>
                        <div class="reconciliation_list_csl">
                            <p>订单号:{{item.id}}</p>
                            <span>时间:{{item.createtime}}</span>
                        </div>
                        <div class="reconciliation_list_csr">
                            <div class="money-status">
                                <p class="status">{{item.status | filterStatus}}</p>
                                <p class="money" :class="{hover:item.status}">{{item.status|filterType}}{{item.money}}</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="nolist" v-show="finished">
                已经没有更多啦
            </div>
        </div>
    </div>
</div>
</body>

</html>
<script src="../../aui/js/aui.js"></script>
<script src="../../script/vue2.js"></script>
<script src="../../script/vue-resource.min.js"></script>
<script src="../../script/common.js"></script>
<script type="text/javascript">
    var vm = new Vue({
        el: "#wrap",
        data: {
            title: '对账明细',
            page: 1,
            types: 0,
            list: [],
            isload: false,
            loading: false, //控制上拉加载的加载动画
            finished: false, //控制在页面往下移动到底部时是否调用接口获取数据
            isLoading: false, //控制下拉刷新的加载动画
        },
        mounted: function() {
            var that = this;
            apiready = function() {
                that.getList(1)
                // api.setRefreshHeaderInfo({
                //     visible: true,
                //     bgColor: '#fff',
                //     textColor: '#666',
                //     textDown: '下拉刷新',
                //     textUp: '释放刷新'
                // }, function(ret, err) {
                //     that.onRefresh()
                // });
                api.addEventListener({ name: 'scrolltobottom' }, function(ret, err) {
                    // that.toDoRequest();
                    that.onLoad2()
                });
            };
        },
        methods: {
            typesCheck: function(e) {
                this.types = e
                this.page = 1
                this.getList(e)
            },
            getList: function(type) {
                var that = this;
                that.isload = true
                showProgress();
                var token = $api.getStorage('userInfo').token
                api.ajax({
                    url: ajaxRoute.withdrawlist,
                    method: 'post',
                    data: {
                        values: {
                            token: token,
                            page: that.page,
                            status: that.status
                        }
                    }
                }, function(res, err) {

                    console.log(JSON.stringify(res));
                    if (res.code == 1) {
                        api.hideProgress();
                        if (type == 2) {
                            api.refreshHeaderLoadDone()
                            that.isLoading = false
                            that.isload = false
                        }
                        that.list = res.data
                    } else {
                        api.hideProgress();
                        api.toast({ msg: res.msg, location: 'middle' });
                    }
                });
            },
            goDetail: function(e) {
                openWinto('detail', 'detail', e)
            },
            getaccountlist2: function() {
                var that = this;
                that.isload = true
                showProgress();
                var token = $api.getStorage('userInfo').token
                api.ajax({
                    url: ajaxRoute.withdrawlist,
                    method: 'post',
                    data: {
                        values: {
                            token: token,
                            page: that.page,
                            status: that.types
                        }
                    }
                }, function(res, err) {
                    // alert(JSON.stringify(res));
                    if (res.code == 1) {
                        api.hideProgress();
                        api.refreshHeaderLoadDone()
                        var s = res.data
                        for (var i = 0; i < s.length; i++) {
                            that.list.push(s[i])
                        }
                        that.loading = false
                        if (res.data.length == 0) {
                            that.loading = false
                            that.finished = true
                        } else {
                            that.loading = false
                        }
                    } else {
                        api.hideProgress();
                        api.toast({ msg: res.msg, location: 'middle' });
                    }
                });
            },
            //下拉刷新
            onRefresh: function() {
                setTimeout(function() {
                    api.refreshHeaderLoadDone()
                    window.location.reload();
                }, 1000);
            },
            onLoad2: function() {
                // 异步更新数据
                var that = this
                that.page++
                setTimeout(function () {
                    that.getaccountlist2();
                }, 500);
            },
        },
        filters: {
            filtersImg:function(img) {
                var imgs = ajaxUrl + '/' + img
                return imgs;
            },
            filterStatus:function(e) {
                return e ? '已审核' : '待审核'
            },
            filterType:function(e) {
                return e ? '-' : '-'
            },
        },
    })
</script>
